<template>
	<div>
		<ul class="list">
			<li v-for="item in jokeList">{{item}}</li>
		</ul>
	</div>
</template>

<script>
	import request from '../utils/request.js'
	export default{
		name:'Joke',
		data(){
			return{
				jokeList:[],
				num:15,
				apiURL:process.env.VUE_APP_BASE_JOKE_TARGET
			}
		},
		created() {
			this.handleGetJoke();
		},
		methods:{
			handleGetJoke()
			{
				var that = this;
				request({
					url:that.apiURL+"/joke/list",
					methods:'get',
					params:{num:that.num}
					
					}).then(function(res){
					that.jokeList=res.data.jokes;
					console.log(that.jokeList);
				})
				
			}
		}
	}
</script>

<style scoped="scoped">
	.list{
		list-style: none;
	}
	.list li{
		text-align: left;
		border-bottom: 1px dotted #13CE66;
		line-height: 30px;
		margin-bottom: 20px;
	}
</style>
